import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'

import Home from '../components/Home.vue'
import News from '../components/News.vue'

import List from '../components/List.vue'

import NotFound from '../components/NotFound.vue'

import WuHan from '../components/WuHan.vue'

import YiChang from '../components/YiChang.vue'

import User from '../components/User.vue'
const router = createRouter({
    history: createWebHashHistory(),
    routes: [
        // { path: '/home', redirect: '/' }
        { path: '/', component: Home },
        { path: '/home', name: 'home', component: Home },
        // { path: '/news', name: 'news', component: News },
        // 动态路由
        { path: '/news/:id', name: 'news', component: News, props: true },
        { path: '/list', name: 'list', component: List, props: { age: 120 } },
        //  方式一 啥都不写
        // { path: '/list/:id/:name', name: 'list', component: List }
        //  方式二  添加props
        // { path: '/list/:id/:name', name: 'list', component: List, props: true }
        // 方式三 合并数据
        // { path: '/list/:id/:name', name: 'list', component: List, props: { age: 100 } }
        {
            path: '/list/:id/:name', name: 'list', component: List, props: route => ({
                id: route.params.id,
                name: route.params.name,
                age: 100
            })
        },


        {

            path: '/user', name: 'user', component: User,
            children: [
                {
                    path: '', component: WuHan,

                },
                {
                    path: 'wuhan', name: 'wuhan', component: WuHan,

                },
                {
                    path: 'yichang', name: 'yichang', component: YiChang,
                }
            ]
        },


        { path: '/:pathMatch(.*)*', component: NotFound },


    ]
})


export default router


